<template >
<div style="text-align: left;">
  
    <div style="margin-bottom: 10px;text-align: left;font-weight: bold;font-size:17px;line-height: 1.3;display: block;">
      <span v-show="item.optional" style="color:red;font-size: 20px;float:left;">* </span>
      <span v-show="autoId">{{num+1}}.</span><span>{{item.title}}</span>
    </div>
    
       <div v-if="item.remark.trim()!=''" style="margin-bottom: 20px;text-align: left;font-size:14px;line-height: 1.3;color:grey;display: block;">
      说明：{{item.remark}}
    </div>
  

    <div style="padding: 0;margin: 0 0 10px 0;display: block;" >
      <el-radio-group v-model="radio" @change="provideanswer"> 
        <el-radio
            v-for="(option) in item.option"
            :key="option.id"
            :label="option.id"
            style="margin:0 0 5px 0;display: block;"
        >{{option.description}}</el-radio>
      </el-radio-group>
    </div>


  </div>
</template>

<script>

export default {
  name:'SingleChoice',
  components:{
    
  },
  data(){
    return{
      radio:0
    }
  },
  props:{
    item:Object,
    id:Number,
    editIcon:String,
    autoId:Boolean,
    num:Number
  },
  computed:{
  
  },
  mounted(){
    console.log('1')
    console.log(this.item)
  },
  methods:{
    provideanswer(){
      console.log('test1')
      let data={
        id:this.item.id,
        answer:this.radio
      };
      this.$emit('sendanswer',data)

    }
  }
}
</script>